import React, { Component } from 'react';
import {
	StyleSheet, View, Text, TouchableOpacity
} from "react-native";
import { GLOBAL } from '../../config/global';
import { style } from '../../theme/style';

const scale = GLOBAL.SCALE;
export class PageBtn extends Component {
	constructor(props) {
		super(props);
	}

	render() {
		let { title, callBack, styleBtn } = this.props;
		return (
			<View style={styles.btnOut}>
				<TouchableOpacity onPress={callBack} style={[styles.btnBox, styleBtn]}>
					<Text style={styles.btnText}>{title}</Text>
				</TouchableOpacity>
			</View>
		)
	}
}

const styles = StyleSheet.create({
	btnOut: {
		width: '100%',
		flexDirection: 'row',
		justifyContent: 'center',
		position: 'absolute',
		bottom: 8 * scale
	},
	btnBox: {
		width: 345 * scale,
		height: 44 * scale,
		borderRadius: 22 * scale,
		backgroundColor: '#2F7BFF',
		alignItems: 'center'
	},
	btnText: {
		lineHeight: 45 * scale,
		textAlign: 'center',
		width: '100%',
		fontSize: 18 * scale,
		color: style.color.white
	}
})